<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>LayIM测试</title>
<link rel="stylesheet" href="/static/layui/css/layui.css" media="all">

<script src="/static/admin/js/jquery.min.js"></script>
<script src="/static/layui/layui.js"></script>
</head>
<body style="background: url(/static/admin/images/irongrip.png) repeat">

<script type="text/javascript">
    //localStorage.clear();
layui.use('layim', function(layim){
	//基础配置
	layim.config({

		//获取主面板列表信息
		init: {
		  url: "{:url('index/getList')}" //接口地址（返回的数据格式见下文）
		  ,type: 'get' //默认get，一般可不填
		  ,data: {} //额外参数
		}
		//获取群员接口
		,members: {
		  url: "{:url('index/getMembers')}" //接口地址（返回的数据格式见下文）
		  ,type: 'get' //默认get，一般可不填
		  ,data: {} //额外参数
		},
		uploadFile: {
			url: "{:url('upload/uploadFile')}"
		}
		,uploadImage: {
			url: "{:url('upload/uploadimg')}"
		}
		,brief: false //是否简约模式（默认false，如果只用到在线客服，且不想显示主面板，可以设置 true）
		,title: '我的LayIM' //主面板最小化后显示的名称
		,maxLength: 3000 //最长发送的字符长度，默认3000
		,isfriend: true //是否开启好友（默认true，即开启）
		,isgroup: true //是否开启群组（默认true，即开启）
		,right: '0px' //默认0px，用于设定主面板右偏移量。该参数可避免遮盖你页面右下角已经的bar。
		,chatLog: "{:url('Chatlog/index')}" //聊天记录地址（如果未填则不显示）
		,find: "{:url('findgroup/index')}" //查找好友/群的地址（如果未填则不显示）
		,copyright: false //是否授权，如果通过官网捐赠获得LayIM，此处可填true
	});

    //建立WebSocket通讯
    var socket;

	function initSocket() {
        socket = new WebSocket('ws://{:config("socket_url")}');
        //连接成功时触发
        socket.onopen = function(){
            // 登录
            var login_data = '{"type":"init","id":"{$uinfo.id}","username":"{$uinfo.username}","avatar":"{$uinfo.avatar}","sign":"{$uinfo.sign}"}';
            socket.send( login_data );
            //console.log( login_data );
            console.log("websocket握手成功!");
        };

        socket.onerror = function (err) {
            console.error(err);
        };

        socket.onclose = function () {
            console.error('socket is closed');
            let reConnect=function () {
                socket = getSocketConnect();
            }
        };

        //监听收到的消息
        socket.onmessage = function(res){
            //console.log(res.data);
            var data = eval("("+res.data+")");
            switch(data['message_type']){
                // 服务端ping客户端
                case 'ping':
                    socket.send('{"type":"ping"}');
                    break;
                // 登录 更新用户列表
                case 'init':
                    //console.log(data['id']+"登录成功");
                    //layim.getMessage(res.data); //res.data即你发送消息传递的数据（阅读：监听发送的消息）
                    break;
                //添加 用户
                case 'addUser':
                    //console.log(data.data);
                    layim.addList(data.data);
                    break;
                //删除 用户
                case 'delUser':
                    layim.removeList({
                        type: 'friend'
                        ,id: data.data.id //好友或者群组ID
                    });
                    break;
                // 添加 分组信息
                case 'addGroup':
                    // console.log(data.data);
                    layim.addList(data.data);
                    break;
                case 'delGroup':
                    layim.removeList({
                        type: 'group'
                        ,id: data.data.id //好友或者群组ID
                    });
                    break;
                // 检测聊天数据
                case 'chatMessage':
                    //console.log(data.data);
                    layim.getMessage(data.data);
                    break;
                // 离线消息推送
                case 'logMessage':
                    setTimeout(function(){layim.getMessage(data.data)}, 1000);
                    break;
                // 用户退出 更新用户列表
                case 'logout':
                    break;
                //聊天还有不在线
                case 'ctUserOutline':
                    console.log('11111');
                    //layer.msg('好友不在线', {'time' : 1000});
                    break;

            }
        };
    }

    initSocket();

	//layim建立就绪
	layim.on('ready', function(res){

        layim.on('sendMessage', function(res){
            //console.log(res);
            // 发送消息
            var mine = JSON.stringify(res.mine);
            var to = JSON.stringify(res.to);
            var login_data = '{"type":"chatMessage","data":{"mine":'+mine+', "to":'+to+'}}';

            let _send = function () {
                debugger;
                if (socket.readyState == 1) {
                    socket.send(login_data);
                }else{
                    setTimeout(_send, 3000);
                    initSocket();
                }
            };
            _send();
        });
    });

});    
</script>
</body>
</html>